<!DOCTYPE html>
<html lang="zh-CN">

<head>
  <meta charset="UTF-8">
  <link rel="shortcut icon" href="../../src/images/bitbug_favicon.ico" type="image/x-icon">
  <meta name="keywords" content="your keywords">
  <meta name="description" content="your description">
  <meta name="author" content="author,email address">
  <meta name="robots" content="index,follow">
  <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
  <title>仁和区党群服务一号通暨群众意见受理中心</title>
  <link rel="stylesheet" href="../../src/css/base.css">
  <link rel="stylesheet" href="../../src/css/common.css">
  <link rel="stylesheet" href="../../src/css/tpl.css">
  <link rel="stylesheet" href="../../src/css/user_center.css">
  <link rel="stylesheet" href="../../src/css/Feedback.css">
  <script src="../../src/js/libs/es5-shim.min.js"></script>
  <script src="../../src/js/libs/es5-sham.min.js"></script>
  <script src="../../src/js/libs/json3.min.js"></script>
</head>

<body>
  <div class="page">
    <div id="header"></div>
    <div class="menu-bar">
      <div class="container">
        <span>
        <span class="crumb-name">当前你的位置：</span>>
        </span>
        <span>
             <a href="../Home/Index.html">首页</a>>
      </span>
        <span>民生投诉</span>
      </div>
    </div>

    <div class="mid_container clearfix">
      <div class="left_guide">
        <h1 class="left_guide_top_size">
          在线民声
        </h1>
        <div class="left_guide_decorate">
        </div>
        <div class="left_about_us">
          THE VOICE OF THE PEOPLE
        </div>
        <div class="left_white_about">
          <a href="Goldidea.html" class="left_white_bottom"><span class="left_cn_about_us">金点子</span></a>
        </div>
        <div class="left_white_about">
          <a href="Feedback.html" class="left_white_bottom"><span class="left_cn_about_us">建议意见</span></a>
        </div>
        <div class="left_white_about active">
          <a href="Notice.html" class="left_white_bottom"><span class="left_cn_about_us">民生投诉</span></a>
        </div>
        <div class="left_white_about">
          <a href="SJMailbox.html" class="left_white_bottom"><span class="left_cn_about_us">书记信箱</span></a>
        </div>
        <div class="left_white_about">
          <a href="QZMailbox.html" class="left_white_bottom"><span class="left_cn_about_us">区长信箱</span></a>
        </div>
        <div class="left_white_about">
          <a href="Demanfar.html" class="left_white_bottom"><span class="left_cn_about_us">来件查询</span></a>
        </div>
      </div>
      <div class="mid_guide">
        <div class="mid_guide_content">
          <div class="content add_content">
            <div class="audit_info_row clearfix">
              <div class="fl left">标&nbsp&nbsp&nbsp题：</div>
              <div class="right">
                <input type="text" id="txttitle">
              </div>
            </div>
            <div class="audit_info_row clearfix">
              <div class="fl left">事发时间：</div>
              <div class="right">
                <input class="laydate-icon" id="indate" value="" placeholder="请选择事发时间" style="width:230px;color:#333;">
              </div>
            </div>
            <div class="audit_info_row clearfix">
              <div class="fl left">事发区域：</div>
              <div class="right">
                <select name="" id="sel_area" style="width:262px">
                  <option value="121111">仁和区</option>
                </select>
              </div>
            </div>
            <div class="audit_info_row clearfix">
              <div class="fl left">投诉类型：</div>
              <div class="right">
                <select name="" id="complaintType" style="width:262px">
                  <option value="1">住房保障类</option>
                  <option value="2">城乡建设类</option>
                  <option value="3">环境保护类</option>
                  <option value="4">行政执法与行业服务类</option>
                  <option value="5">城市管理类</option>
                  <option value="6">安全与生产类</option>
                  <option value="7">土地权属纠纷类</option>
                  <option value="8">劳动和社会保障类</option>
                  <option value="9">涉法涉诉类</option>
                  <option value="10">征地补偿类</option>
                  <option value="11">交通运输类</option>
                  <option value="12">生活待遇类</option>
                  <option value="13">教育类</option>
                  <option value="-1">其它</option>
                </select>
              </div>
            </div>
            <div class="audit_info_row clearfix">
              <div class="fl left">详细地址：</div>
              <div class="right">
                <input type="text" placeholder="不必重复填写省市区" id="txtaddress">
              </div>
            </div>
            <div class="audit_info_row clearfix">
              <div class="fl left">投诉内容：</div>
              <div class="right unlimited">
                <textarea name="" placeholder="请填写事件具体内容" id="txtcontent"></textarea>
              </div>
            </div>
            <div class="audit_info_row clearfix">
              <form name="picurls" enctype="multipart/form-data" id="pic_uplod_from">
                <div class="fl left">图片上传：</div>
                <div class="right unlimited">
                  <div><input type="button" class="buttfile" id="file" onclick="upload()" value="添加"></div>
                  <div id="attach">
                    <span style="display:none;" id="_picurl" class="0"></span>
                    <input type="file" class="pic_upload" id="up_img" name="titleurl" style="display:none" onchange="addpic()">
                  </div>
                  <div class="attachmentfont">支持jpg、png、gif、bmp、pdf文件格式,单个文件不能超过1M，最多可以提交5个附件</div>
                  <div id="piclist" class="preview_list">
                    <ul>
                    </ul>
                  </div>
                </div>
              </form>
            </div>
            <div class="audit_info_row clearfix">
              <form name="videosform" enctype="multipart/form-data" id="video_uplod_from" action="" method="post">
                <div class="fl left">音频上传：</div>
                <div class="right unlimited">
                  <div><input type="button" class="buttfile" id="filevideoadd" onclick="upvideoload()" value="添加"></div>
                  <div>
                    <span style="display:none;" id="_videourl" class="0"></span>
                    <input type="file" class="video_upload" id="up_videofile" name="titleurl" style="display:none" onchange="addvideo()">
                  </div>
                  <div class="attachmentfont">支持MP3格式，文件大小不能大于5M</div>
                  <div id="videoname" class="file_bar" style="display:none">
                    <div class="videoname"></div>
                    <i class="remove_icon" onclick="deleteVideos()"></i>
                  </div>
                </div>
              </form>
            </div>
            <div class="audit_info_row clearfix">
              <form name="audiosform" enctype="multipart/form-data" id="audio_uplod_from" action="" method="post">
                <div class="fl left">视频上传：</div>
                <div class="right unlimited">
                  <div><input type="button" class="buttfile" id="fileaudioadd" onclick="upaudioload()" value="添加"></div>
                  <div>
                    <span style="display:none;" id="_audiourl" class="0"></span>
                    <input type="file" class="audio_upload" id="up_audiofile" name="titleurl" style="display:none" onchange="addaudio()">
                  </div>
                  <div class="attachmentfont">支持MP4格式，文件大小不能大于20M</div>
                  <div id="audioname" class="file_bar" style="display:none">
                    <div class="audioname"></div>
                    <i class="remove_icon" onclick="deleteAudios()"></i>
                  </div>
                </div>
              </form>
            </div>
          </div>
          <div class="btn_bar">
            <input type="button" value="提交" class="butt red" onclick="add()">
            <a href="javascript:;" onclick="history.go(-1)"><input type="button" value="返回" class="butt white"></a>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div id="footer"></div>
  <script src="../../src/js/libs/jquery.1.12.4.js"></script>
  <script src="../../src/js/libs/laydate/laydate.js"></script>
  <script src="../../src/js/libs/jquery.form.js"></script>
  <script src="../../src/js/libs/layer/layer.js"></script>
  <script src="../../src/js/base/common.js"></script>
  <script>
    var typeid = 0;
    var pageindex = 4
    if (document.cookie.length <= 1) {
      window.location.href = "/HomePage/HomePage";
    }
    var userid = document.cookie.split(";")[1].split("=")[1];
    var videoaftername = "";
    var audioaftername = "";
    laydate({
      elem: '#indate',
      max: laydate.now()
    })
    $('select').on('change', function () {
      $(this).toggleClass('unselected', $(this).val() === "");
    });

    function upload() {
      $(".pic_upload").click();
      file = $("#up_img").value;
    }

    //上传图片
    function addpic() {
      //判断文件后缀和大小
      var fileobj = document.getElementById("up_img").value.match(/^(.*)(\.)(.{1,8})$/)[3];
      if (fileobj != 'jpg' && fileobj != 'png' && fileobj != 'gif' && fileobj != 'bmp' && fileobj != 'pdf') {
        layer.alert("上传的图片格式不正确，请重新上传！");
        return;
      }
      if (showsize(document.getElementById("up_img")) > 1000) {
        layer.alert("图片大小不能超过1M,请重新上传！");
        return;
      }
      var maxnum = 5;
      var num = $("#piclist li").length;
      if (num < maxnum) {
        var filesinfo = [];
        filesinfo.push({
          desc: "",
          module: 1007,
          relateid: 0,
          remark: "",
          size: "",
          time: ""
        });
        $("#pic_uplod_from").ajaxSubmit({
          type: "POST",
          url: "http://221.10.2.222:5680/api/ow/Files?filesinfo=" + escape(JSON.stringify(filesinfo)),
          success: function (result) {
            if (result.count > 0) {
              if (result.count > 0) {
                var filename = result.datalist;
                var imgname = filename[0];
                num += 1;
                var html = '<li class="newimg" imgname="' + imgname +
                  '"><div class="preview_list_img" style="background:url(http://221.10.2.222:5680/api/v1/Files?filename=' +
                  filename[0] + ') center;background-size: cover;">' +
                  '<img src="../../src/images/g-3.png" class="deleteimg fr" onclick="deleteImg(this);" /></li>';
                $("#piclist ul").append(html);
              }
            } else {
              layer.alert('图片上传失败！');
            }
          },
          error: function (error) {
            layer.alert('图片上传失败！');
          }
        });
      } else {
        layer.alert('附件超出数量！');
      }
    }

    //删除图片
    function deleteImg(ele) {
      $(ele).parent().remove();
    }

    //上传音频相关
    function upvideoload() {
      $(".video_upload").click();
      file = $("#up_videofile").value;
    }

    function deleteVideos() {
      $("#videoname").find('.videoname').text('');
      $("#videoname").hide();
      $("#filevideoadd").attr("disabled", false);
      $("#filevideoadd").css("background", "#fff");
      $("#filevideoadd").css("color", "#666");
    }

    function addvideo() {
      //判断文件后缀和大小
      var fileobj = document.getElementById("up_videofile").value.match(/^(.*)(\.)(.{1,8})$/)[3];
      if (fileobj != 'mp3' && fileobj != 'MP3') {
        layer.alert("上传的文件类型不正确，请重新上传！");
        return;
      }
      if (showsize(document.getElementById("up_videofile")) > 5000) {
        layer.alert("文件大小不能超过5M,请重新上传！");
        return;
      }

      var filesinfo = [];
      filesinfo.push({
        desc: "",
        module: 1009,
        relateid: 0,
        remark: "",
        size: "",
        time: ""
      });
      $("#video_uplod_from").ajaxSubmit({
        type: "POST",
        url: "http://221.10.2.222:5680/api/ow/Files?filesinfo=" + escape(JSON.stringify(filesinfo)),
        success: function (result) {
          if (result.count > 0) {
            var vname = result.datalist;
            videoaftername = vname[0];
            var v = "";
            if ($("#up_videofile").val().split('\\').slice(-1)[0].length > 20) {
              v = $("#up_videofile").val().split('\\').slice(-1)[0].substring(0, 20) + "......"
            } else {
              v = $("#up_videofile").val().split('\\').slice(-1)[0]
            }
            $("#videoname").show();
            $("#videoname").find('.videoname').text(v);
            $("#filevideoadd").attr("disabled", true);
            $("#filevideoadd").css("background", "#f1f1f1");
            $("#filevideoadd").css("color", "#999");
          } else {
            layer.alert("音频上传失败！")
          }
        },
        error: function (error) {
          layer.alert("音频上传失败！")
        }
      });
    }

    ///上传视频相关
    function upaudioload() {
      $(".audio_upload").click();
      file = $("#up_audiofile").value;
    }

    function deleteAudios() {
      $("#audioname").find('.audioname').text('');
      $("#audioname").hide();
      $("#fileaudioadd").attr("disabled", false);
      $("#fileaudioadd").css("background", "#fff");
      $("#fileaudioadd").css("color", "#333");
    }

    function addaudio() {
      //判断文件后缀和大小
      var fileobj = document.getElementById("up_audiofile").value.match(/^(.*)(\.)(.{1,8})$/)[3];
      if (fileobj != 'mp4' && fileobj != 'MP4') {
        layer.alert("上传的文件类型不正确，请重新上传！");
        return;
      }
      if (showsize(document.getElementById("up_audiofile")) > 20000) {
        layer.alert("文件大小不能超过20M,请重新上传！");
        return;
      }

      var filesinfo = [];
      filesinfo.push({
        desc: "",
        module: 1009,
        relateid: 0,
        remark: "",
        size: "",
        time: ""
      });
      $("#audio_uplod_from").ajaxSubmit({
        type: "POST",
        url: "http://221.10.2.222:5680/api/ow/Files?filesinfo=" + escape(JSON.stringify(filesinfo)),
        success: function (result) {
          if (result.count > 0) {
            var aname = result.datalist;
            audioaftername = aname[0];
            var a = "";
            if ($("#up_audiofile").val().split('\\').slice(-1)[0].length > 40) {
              a = $("#up_audiofile").val().split('\\').slice(-1)[0].substring(0, 40) + "......"
            } else {
              a = $("#up_audiofile").val().split('\\').slice(-1)[0]
            }
            $("#audioname").show();
            $("#audioname").find('.audioname').text(a);
            $("#fileaudioadd").attr("disabled", true);
            $("#fileaudioadd").css("background", "#fff");
            $("#fileaudioadd").css("color", "#bbb");
          } else {
            layer.alert("视频上传失败！")
          }
        },
        error: function (error) {
          layer.alert("视频上传失败！")
        }
      });
    }

    //判断文件大小
    var isIE = /msie/i.test(navigator.userAgent) && !window.opera;

    function showsize(target) {
      var fileSize = 0;
      if (isIE && !target.files) {
        var filePath = target.value;
        var fileSystem = new ActiveXObject("Scripting.FileSystemObject");
        var file = fileSystem.GetFile(filePath);
        fileSize = file.Size;
      } else {
        fileSize = target.files[0].size;
      }
      var size = fileSize / 1024;
      return size.toFixed(2);
    }

    function add() {
      //内容
      if ($("#txttitle").val() == "") {
        layer.alert('请输入投诉标题！')
        return;
      }
      if ($("#indate").val() == "") {
        layer.alert('请输入事发时间！')
        return;
      }
      if ($("#sel_area option:selected").val() == 0) {
        return;
      }
      if ($("#txtaddress").val() == "") {
        layer.alert('请输入事发地址！')
        return;
      }
      if ($("#txtcontent").val() == "") {
        layer.alert('请输入投诉内容！')
        return;
      }
      var imglist = "";
      $("#piclist li").each(function (index) {
        if (index == 0) {
          imglist += $(this).attr('imgname');
        } else {
          imglist += "/" + $(this).attr('imgname');
        }
      });
      var news = {
        "userid": userid,
        "title": $("#txttitle").val(),
        "area": $("#sel_area option:selected").val(),
        "complaintType": $("#complaintType option:selected").val(),
        "address": $("#txtaddress").val(),
        "content": $("#txtcontent").val().replace(/\n/g, "<br/>"),
        "picurls": imglist,
        "incidenttime": $("#indate").val(),
        "type": 2,
        "videourl": audioaftername,
        "audiourl": videoaftername,
        "source": 3,
        "appealtype": 1,
        "mailbox": ""
      };
      //处理回车
      news.content = news.content.replace(/\n/g, "<br/>");
      news.content = news.content.replace(/\r/g, "<br/>");
      $.ajax({
        type: "POST",
        url: "http://221.10.2.222:5680/api/ow/Complain/Add",
        // url: 'http://192.168.0.181:8083/api/ow/Complain/Add',
        dataType: "json",
        data: news,
        success: function (data) {
          //var result = JSON.parse(data);
          if (data.result > 0) {
            window.location.href = "../Complain/Index.html";
          } else {
            layer.alert('添加失败');
          }
        }
      });
    }
  </script>
</body>

</html>